<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<%--<head>--%>
<%--<meta charset="utf-8">--%>
<%--<meta http-equiv="X-UA-Compatible" content="IE=edge">--%>
<%--<meta name="viewport" content="width=device-width, initial-scale=1">--%>
<%--<title>注册</title>--%>
<%--<link href="../css/bootstrap.min.css" rel="stylesheet">--%>
<%--</head>--%>
<%--<body>--%>

<%--<div class="container">--%>
<%--<form class="form-horizontal" style="width: 400px; margin: 100px auto"  method="post">--%>
<%--<div class="form-group">--%>
<%--<label for="username" class="col-sm-2 control-label">账号</label>--%>
<%--<div class="col-sm-10">--%>
<%--<input type="text" class="form-control" name="username" id="username" placeholder="账号">--%>
<%--</div>--%>
<%--</div>--%>
<%--<div class="form-group">--%>
<%--<label for="password" class="col-sm-2 control-label">密码</label>--%>
<%--<div class="col-sm-10">--%>
<%--<input type="password" class="form-control" name="password" id="password" placeholder="密码">--%>
<%--</div>--%>
<%--</div>--%>
<%--<div class="form-group">--%>
<%--<label for="repassword" class="col-sm-2 control-label">确认密码</label>--%>
<%--<div class="col-sm-10">--%>
<%--<input type="password" class="form-control" name="repassword" id="repassword" placeholder="再次确认密码">--%>
<%--</div>--%>
<%--</div>--%>
<%--<div class="form-group">--%>
<%--<label for="nickname" class="col-sm-2 control-label">昵称</label>--%>
<%--<div class="col-sm-10">--%>
<%--<input type="text" class="form-control" name="nickname" id="nickname" placeholder="昵称">--%>
<%--</div>--%>
<%--</div>--%>

<%--<label class="col-sm-2 control-label">性别</label>--%>
<%--<input type="radio" value="男" name="age"> 男--%>
<%--<input type="radio" value="女" name="age"> 女--%>
<%--<br>--%>
<%--<br>--%>

<%--<div class="form-group">--%>
<%--<label for="age" class="col-sm-2 control-label">年龄</label>--%>
<%--<div class="col-sm-10">--%>
<%--<input type="text" class="form-control" name="age" id="age" placeholder="年龄">--%>
<%--</div>--%>
<%--</div>--%>
<%--<div class="form-group">--%>
<%--<label for="email" class="col-sm-2 control-label">email</label>--%>
<%--<div class="col-sm-10">--%>
<%--<input type="text" class="form-control" name="email" id="email" placeholder="email">--%>
<%--</div>--%>
<%--</div>--%>
<%--<div class="form-group">--%>
<%--<div class="col-sm-offset-2 col-sm-10">--%>
<%--<button type="button" class="btn btn-default" id="sub" onclick="">提交</button>--%>
<%--</div>--%>
<%--</div>--%>
<%--</form>--%>
<%--</div>--%>

<%--</body>--%>
<%--</html>--%>

<head>
    <meta charset="utf-8">
    <title>人人乐信息管理系统</title>
    <link rel="stylesheet" type="text/css" href="/css/style.css"/>
    <script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>
</head>

<body>
<div class="container">
    <div class="loginbox">
        <div class="loginform">
            <div class="clear" style="height:146px"></div>
            <h2>人人乐信息管理系统</h2>
            <form action="/loginsubmit" method="post">
                <table width="100%" border="0">
                    <tr>
                        <td>
                            <span>用户名</span>
                            <input class="uname" type="text" name="username" id="username" placeholder="账号"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <span>密码</span>
                            <input class="pword" type="password" name="password" id="password" placeholder="密码"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <span>密码</span>
                            <input class="pword" type="password" name="repassword" id="repassword" placeholder="确认密码"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <span>昵称</span>
                            <input class="uname" type="text" name="nickname" id="nickname" placeholder="昵称"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <span>性别</span>
                            <input type="radio" value="男" name="sex" class="radio"> 男
                            <input type="radio" value="女" name="sex" class="radio"> 女
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <span>年龄</span>
                            <input type="text" class="uname" name="age" id="age" placeholder="年龄">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <span>email</span>
                            <input type="email" class="uname" name="email" id="email" placeholder="email">
                        </td>
                    </tr>
                    <tr>
                        <td height="80">
                            <a class="logbtn" id="loginBtn" onclick="">注册</a>
                        </td>
                    </tr>
                </table>
            </form>
        </div>
    </div>
</div>
<script src="../js/jquery-3.2.1.js"></script>
<script>
    $(function () {
        $(".loginform form td input").focus(function () {
            $(this).css("border-color", "#56c68b");
        });
        $(".loginform form td input").blur(function () {
            $(this).css("border-color", "#bdbcbc");
        });
    });
</script>

<script src="../js/jquery-3.2.1.js"></script>
<script>

    $("#loginBtn").click(function () {
        if ($("#password").val() === $("#repassword").val()) {
            $.ajax({
                url: "register",
                type: "post",
                data: {
                    username: $("#username").val(),
                    password: $("#password").val(),
                    sex: $("input[type=\"radio\"]:checked").val(),
                    age: $("#age").val(),
                    email: $("#email").val(),
                    nickname: $("#nickname").val()
                },
                success: function (result) {
                    if (result.msg === "成功") {
                        alert("注册成功");
                        window.location.href = "/loginPage";
                    } else {
                        alert("注册失败，账号重复")
                    }
                },
                error: function () {
                    alert("错误")
                }
            })
        } else {
            alert("两次输入密码不一致")
        }
    });
</script>
</body>
</html>

